Web Design and Development 1 (Version 2)

Make a Google Folder and share it with me, hand in your work through this shared folder.

Student Check List - make a copy of this checklist using Google,in the document title change the "student" to your name. This is to help you and I keep track of where you are and where you are going.

Web Design V2 - Student - Direct link to the resource provided by the University of Washington.

• Unit One: Designing and Planning Web Page
• Unit Two: Creating Web Pages with HTML
  • 
    

• Unit Three: Formatting Web Pages with Style Sheets
• Unit Four: Graphics
• Unit Five: Scripting
• Unit Six: Quality Control
• Unit Seven: Website Management and Authoring Tools
• Unit Eight: Client Website

Student Assignment Checklist

In supporting browsers, this page should automatically print with page breaks between units, and column headings repeated at the top of each page. For best results, print this page in landscape.

Unit	Module	Lesson	Assignment	Date Completed	Instructor's Initials
1: Designing and Planning Web Pages	1: Basic Site Evaluation and Rubric Creation	1: Surveying the Possibilities	Create table with evaluations of one good and one bad site
		2: Developing a Website Evaluation Tool	Develop a website evaluation tool (group activity)
	2: Color Theory	1: Color Theory in Web Design	Answer 5 Reading Check questions
	3: Web Standards & Accessible Design	1: Web Standards	Participate in group activity
		2: How People with Disabilities Access the Web	Participate in various activities
	4: Planning a Website	1: Organizing a Website	Answer 3 Reading Check questions; organize set of cards
2: Creating Pages with HTML	1: Pre-Coding	1: Pre-coding	Sketch home page and folder structure
	2: Basic HTML Markup	1: HTML Syntax	Answer 5 questions
		2: Essential Tags	Create six "bare bones" pages
		3: Common Tags	Add common HTML tags to index.html
	3: HTML Lists	1: Lists	Add two unordered lists to index.html
		2: Creating a Navigation Menu	Add a navigation menu (unordered list) to index.html
	4: Creating Links	1: Linking to External Internet Sites	Add a working external link to index.html
		2: Linking to Pages Within Your Website	Add a set of working links to the navigation menu in index.html
		3: Special Types of Links	Add "Skip to main content" and email links to index.html
	5: Creating a Data Table	1: Creating a Data Table	Add a data table to accessibility.html
	6: Reflections	1: Reflections	Add Reflections content to index.html
3: Formatting Web Pages with Style Sheets	1: Introduction to Cascading Style Sheets	1: Anatomy of a Style	Add <style> section to index.html containing basic CSS
		2: Applying Styles	Add more CSS styles to index.html
		3: Linking to an External Style Sheet	Moved CSS to an external file; add a link element to index.html; copy various tags to all HTML files
	2: Color in CSS	1: Understanding Color in CSS	Select a color scheme for a fictitious site
		2: Applying Color in CSS	Select a color scheme for portfolio s site; Add a comment to top of CSS file with color codes defining site's color scheme; implement; Apply color scheme to site
	3: Typography in CSS	1: Understanding Typography in CSS	Create a list of good and bad sites based on their typography
		2: Applying Typography in CSS	Create two tables listing preferred body and heading fonts; apply these fonts to site CSS
	4: The Box Model in CSS	1: Understanding The Box Model in CSS	Nothing to hand in, but... Understand the box model!
		2: Applying The Box Model in CSS	Add new styles to CSS file; add a <style> section to accessibility.html with styles for the data table
	5: The Role of ID and Class in CSS	1: Understanding ID and Class in CSS	Add class and id attributes to various elements in index.html
		2: Applying ID and Class in CSS	Add styles to CSS file that change the appearance of various elements based on their id and class
		3: Pseudo-class Selectors in CSS	Add pseudo-class selectors to CSS file
	6: Page Layout Techniques	1: Page Layout with CSS	Add styles to CSS file that control the position of various elements
		2: Stylizing a Navigation Menu with CSS	Add styles to CSS file to make navigation menu look like a menu
	7: Reflections	1: Reflections	Add Reflections content to index.html
4: Graphics	1: Introduction to Web Graphics	1: Introduction to Web Graphics	Add new section to graphics.html containing answers to 2 questions on graphics.html
		2: Copyright Law and Graphics on the Web	Participate in group activity
	2: Creating a Web Photo Album	1: Understanding Web Graphics	Add new section to graphics.html containing answers to 5 questions
		2: Acquiring Images for Web Graphics	Acquire 3 images
		3: Cropping and Resizing	Produce 6 images in 2 different sizes
		4: Adding Images to Your Web Page	Added photo album to graphics.html
	3: Creating a Button	1: Basic Shapes and Colors	Create a basic button shape
		2: Working With Layers	Add email and camera icons to buttons
		3: Optimizing GIF Images	Export email and camera buttons and add them both to index.html and graphics.html
		4: Creating a Favicon	Create a favicon and add it to site
	4: Creating a Web Page Banner	1: Selection Tools	Create a practice image by extracting objects from an original source image
		2: Layer Effects and Blending	Create a banner; add it to site
		3: Background Images	Add a background image to site
	5: Reflections	1: Reflections	Add Reflections content to index.html
5: Scripting	1: Overview of Scripting on the Web	1: Client-side vs Server-side Scripting	Participate in group activity; create a list of 3 websites
	2: JavaScript	1: Using JavaScript to Show an Alert	Add code to javascript.html that shows an alert
		2: JavaScript Errors and Debugging	Find the bugs in the 3 buggy examples
		3: Building a JavaScript Clock Part 1	Add code to javascript.html that displays a clock
		4: Building a JavaScript Clock Part 2	Enhance clock by adding features (with JavaScript) and style (with CSS)
		5: Using Javascript to Hide and Show Content	Add code to javascript.html that allows users to show or hide the clock
	3: Reflections	1: Reflections	Add Reflections content to index.html
6: Quality Control	1: Validating Websites	1: Validating Your HTML	HTML validation errors fixed in example page; portfolio site passes HTML validation
		2: Validating Your CSS	CSS validation errors fixed in example page; portfolio site passes CSS validation
		3: Validating Your Accessibility	Add an accessibility review of your school's home page to accessibility.html
	2: Testing Usability	1: Conducting a Usability Test	Participate in group activity; add a usability report to usability.html
	3: Reflections	1: Reflections	Add Reflections content to index.html
7: Website Management and Authoring Tools	1: Web Authoring Software	1: Basic Features of Web Authoring Software	Add conent to a copy of tools.html using web authoring software
		2: Content, Structure, Presentation, and Behavior	Modify styles within copy of tools.html
		3: Site Management Features	Three or more sitewide tests run, reports generated
	2: Publishing on the Web	1: Website Hosting Services	Create ranked list of 3 top and 3 bottom choices of web service providers; participate in group activity
		2: Website Publishing Tools	No assignment.
	3: Reflections	1: Reflections	Add Reflections content to index.html
8: Client Website	1: Client Website	1: Planning the Client Website	Complete Market Analysis worksheet; Organize site; sketch home page
		2: Constructing the Client Website	Develop client website
		3: Quality Control of the Client Website	Validate website; test accessibility; deliver site to client
	2: Reflections	1: Reflections	Add Reflections content to index.html